<template>
	<view class="content">
		<view class="top">
			<view class="payInput">
				<view class="sign iconfont">&#xe604;</view>
				<view class="money">
					<input class="input" type="digit" placeholder="请输入提现金额" v-model="money" placeholder-class="pla" />
				</view>
			</view>
		</view>

		<view class="group">
			<view class="grouplist">
				<radio-group @change="radioChange">
					<label class="uni-list-cell" v-for="(item, index) in items" :key="index">
						<view class="uni_name">
							<image class="uni_icon" :src="item.image" mode=""></image>
							<view class="uni_detail">{{item.name}}</view>
						</view>
						<view>
							<radio :value="item.value" class="radio" color="#E42221" :disabled="item.disabled" />
						</view>
					</label>
				</radio-group>
			</view>
		</view>
			<!-- <view class="grouptipx">
				提示：在个人中心没有绑定微信、支付宝、银联、是不能进行选择的！！！
			</view>
		</view>
		<view class="uploadpic">
			<view class="uploadtxt">上传手持身份证照片</view>
			<view class="uploadimg">
				<image class="img" :src="cardImgae == '' ? 'https://taobaoke-paimai.oss-cn-beijing.aliyuncs.com/zm.png' : cardImgae" mode="" @click="upload"></image>
			</view>
		</view> -->
		<!-- <view class="payAccount" v-if="payType != ''">
			<view class="payInput">
				<view class="paytxt">姓名</view>
				<view class="money">
					<input class="input" type="text" placeholder="请输入姓名" v-model="name" placeholder-class="pla" />
				</view>
			</view>
			<view class="payInput" v-if="payType == 1">
				<view class="paytxt">支付宝账号</view>
				<view class="money">
					<input class="input" type="text" placeholder="请输入支付宝账号" v-model="alipayCode" placeholder-class="pla" />
				</view>
			</view>
			<view class="payInput" v-if="payType == 2">
				<view class="paytxt">微信账号</view>
				<view class="money">
					<input class="input" type="text" placeholder="请输入微信账号" v-model="weixin" placeholder-class="pla" />
				</view>
			</view>
		 -->

		<view class="bottom">
			<view class="submit" @click="goRecharge">立即提现</view>
		</view>
		<!-- <view class="reminder" v-if="depositType == 2">
			<view class="">温馨提示：佣金最少提现金额100元</view>
			<view class="">根据现行税收法律法规，个人推荐取得的分享奖励属于应税所得，平台将扣除佣金的12%来缴纳税款和服务费，其中2%用来支付银行转账手续费，
				请知悉！</view>
		</view> -->

	</view>
</template>

<script>
	import urlConfig from '@/common/api/config.js'
	export default {
		data() {
			return {
				items: [
					// #ifdef APP-PLUS
					{
						value: '1',
						name: '支付宝',
						checked: 'true',
						image: 'https://taobaoke-paimai.oss-cn-beijing.aliyuncs.com/alipay.png',
						disabled: false
					},
					// #endif
					{
						value: '2',
						name: '微信',
						image: 'https://taobaoke-paimai.oss-cn-beijing.aliyuncs.com/wxpay.png',
						disabled: false
					},
					// {
					// 	value: '4',
					// 	name: '银行卡',
					// 	image: 'https://taobaoke-paimai.oss-cn-beijing.aliyuncs.com/bank.png',
					// 	disabled: false
					// }
				],
				money: '',
				payType: '',
				depositType: '',
				alipayCode: '', // 支付宝账号
				name: '', // 姓名
				weixin: '', // 微信账号
				userInfo: {},
				cardImgae: ''

			}
		},
		onLoad(options) {
			console.log(options)
			this.depositType = options.depositType
			this.getUserInfo();
		},
		methods: {
			radioChange: function(e) {
				console.log(e)
				let drawType = e.detail.value;
				this.payType = e.detail.value;

				// if (drawType == 1) {
				// 	this.payType = 'alipay'
				// } else if (drawType == 2) {
				// 	this.payType = 'weixin'
				// }

			},
			// 立即支付
			goRecharge: function() {
				let that = this;
				console.log(that.money)
				if (that.money == '') {
					that.tui.toast('请输入提现金额')
					return
				} else if (that.payType == '') {
					that.tui.toast('请选择提现方式')
					return
				}
				// else if (that.cardImgae == '') {
				// 	that.tui.toast('请上传手持身份证照片')
				// }
				that.api.getUserWithdraw({
					money: that.money,
					extractType: that.payType,
					type: that.depositType,
					cardImgae:that.cardImgae
				}).then(res => {
					console.log(res)
					that.tui.toast(res.data)
					setTimeout(function() {
						that.cacheHelper.updateUserInfo()
						uni.$emit('update', {
							msg: '更新'
						})
					}, 500)
					setTimeout(function() {
						uni.navigateBack({
							delta: 1
						});
					}, 1000)

				})

			},

			// 获取我的信息
			getUserInfo: function() {
				this.api.getUserInfo().then(res => {
					console.log(res)
					this.userInfo = res.data.yxUserinfo;
					let userInfo = res.data.yxUserinfo;
					if (userInfo.bindBank == 0) {
						this.items[2].disabled = true;
					} 
					if (userInfo.bindWx == 0) {
						this.items[1].disabled = true;
					} 
					if (userInfo.bindZfb == 0) {
						this.items[0].disabled = true;
					}

				})
			},
			// 上传
			upload: function() {
				let that = this;
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths;
						uni.uploadFile({
							url: urlConfig + 'uploadService', //接口地址
							filePath: tempFilePaths[0],
							name: 'file',
							success: (res) => {
								console.log(res);
								var data = JSON.parse(res.data);
								console.log(data, "======")
								that.cardImgae = data.data.data;
							}
						});
					}
				});


			}


		},
		// 监听返回按钮
		onBackPress(e) {
			console.log(e)
		}
	}
</script>

<style lang="less">
	page {
		width: 100%;
		box-sizing: border-box;
		letter-spacing: 3rpx;
		background: #FFFFFF;
		font-family: PingFang SC;
		font-size: 32rpx;
		color: #333333;
		padding: 30rpx;
	}

	.content {
		width: 100%;
		box-sizing: border-box;
	}

	.reminder {
		width: 100%;
		box-sizing: border-box;
		font-size: 28rpx;
		line-height: 42rpx;
		color: #F36E73;
		margin-top: 20rpx;
	}

	.top {
		width: 100%;
		box-sizing: border-box;
		text-align: center;

		.paymoney {
			width: 418rpx;
			line-height: 100rpx;
			margin: 20rpx auto 30rpx auto;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 80rpx;
			color: #333333;
			font-weight: bold;

			.sign {
				font-size: 50rpx;
				padding-top: 15rpx;
				color: #FFDA71;
			}
		}

		.payInput {
			width: 100%;
			box-sizing: border-box;
			padding: 20rpx 30rpx;
			display: flex;
			justify-content: flex-start;
			align-items: center;
			font-size: 60rpx;
			color: #333333;

			.sign {
				font-size: 40rpx;
				color: #FFDA71;
			}

			.money {
				width: calc(100% - 80rpx);
				box-sizing: border-box;
				padding-left: 15rpx;
				text-align: left;

				.pla {
					color: #999999;
					font-size: 40rpx;
				}
			}


		}

	}

	.group {
		width: 100%;
		box-sizing: border-box;
		padding: 30rpx 0 30rpx 0;

		.grouplist {
			width: 100%;
			box-sizing: border-box;

			.uni-list-cell {
				width: 100%;
				box-sizing: border-box;
				display: flex;
				justify-content: space-between;
				align-items: center;
				line-height: 60rpx;
				padding: 20rpx 0;

				.radio {
					transform: scale(0.8);
				}

				.uni_name {
					display: flex;
					justify-content: flex-start;
					align-items: center;

					.uni_icon {
						width: 50rpx;
						height: 50rpx;
					}

					.uni_detail {
						padding-left: 22rpx;
					}

				}
			}

		}

		.grouptipx {
			width: 100%;
			box-sizing: border-box;
			line-height: 50rpx;
			color: #E42221;
		}
	}

	.payAccount {
		width: 100%;
		box-sizing: border-box;

		.payInput {
			width: 100%;
			box-sizing: border-box;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 20rpx 0;

			.paytxt {
				width: 170rpx;
				box-sizing: border-box;
				font-size: 32rpx;
			}

			.money {
				width: calc(100% - 170rpx);
				box-sizing: border-box;
				padding-left: 20rpx;

				.input {
					width: 100%;
					box-sizing: border-box;
					height: 60rpx;
					line-height: 60rpx;
				}
			}

		}

	}

	.uploadpic {
		width: 100%;
		box-sizing: border-box;
		padding: 20rpx 30rpx;

		.uploadtxt {
			width: 100%;
			box-sizing: border-box;
			font-size: 30rpx;
			line-height: 60rpx;
			padding-bottom: 20rpx;
		}

		.uploadimg {
			width: 260rpx;
			height: 170rpx;

			.img {
				width: 100%;
				height: 100%;
			}
		}


	}




	.bottom {
		width: 100%;
		box-sizing: border-box;
		background: #FFFFFF;
		padding: 0rpx 50rpx;
		margin-top: 200rpx;

		.submit {
			width: 100%;
			box-sizing: border-box;
			text-align: center;
			font-size: 30rpx;
			color: #FFFFFF;
			background: #E42221;
			border-radius: 8rpx;
			line-height: 94rpx;
		}
	}
</style>
